<div class="container">


  <div class="row">
    <div class="col-md-8" style="background-color: #18BC9C;padding-bottom: 10px;padding-top: 10px">
      <div style="font-size: 50px; padding-left: 50px">
        <%= image_tag "profile.png" %>
        Learning RoR!
      </div>

    </div>

    <div class="col-md-4">
      <h1>在线选课系统样本</h1>
      <p>这个样本系统是基于国科大研究生课程(高级软件工程)开发的项目,目的是帮助入门者学习RoR(Ruby on Rails),这是适合新学者的入手的第一个项目</p>
      <p>入门者可以在这个样本系统上增加更多的功能:</p>
      <ul>

        <li class="text-danger">
          处理选课冲突、控制选课人数
        </li>
        <li class="text-danger">
          统计选课学分,增加选课的开放、关闭功能
        </li>
        <li class="text-danger">
          自定义管理员后台
        </li>
        <li class="text-danger">
          基于OAuth的授权登陆
        </li>
        <li class="text-danger">
          Excel格式的数据导入
        </li>
      </ul>

    </div>

  </div>

  <hr>

  <div class="row">
    <div class="col-lg-12">
      <div class="alert alert-info text-center">
        开发此项目,你需要具备以下的知识:
      </div>
    </div>

  </div>


  <div class="row">
    <div class="col-md-4">
      <h2>Bootstrap</h2>
      <p>Bootstrap，来自 Twitter，是目前很受欢迎的前端框架。Bootstrap 是基于 HTML、CSS、JAVASCRIPT 的，它简洁灵活，使得 Web 开发更加快捷. 它由Twitter的设计师Mark
        Otto和Jacob Thornton合作开发，是一个CSS/HTML框架。Bootstrap提供了优雅的HTML和CSS规范，它即是由动态CSS语言Less写成。</p>
      <a class="btn btn-info" href="http://www.w3schools.com/bootstrap/">More Info</a>
    </div>

    <div class="col-md-4">
      <h2>Javascript/CSS</h2>
      <p>JavaScript一种直译式脚本语言,广泛用于客户端的脚本语言,是一种动态类型、弱类型、基于原型的语言，内置支持类型，最早是在HTML（标准通用标记语言下的一个应用）网页上使用，用来给HTML网页增加动态功能。CSS
        (Cascading Style Sheets)是一种用来表现HTML样式的样式语言,能够真正做到网页表现与内容分离。
      </p>
      <a class="btn btn-info" href="http://www.runoob.com/js/js-tutorial.html">More Info</a>
    </div>

    <div class="col-md-4">
      <h2>Rails Framework</h2>
      <p>Rails基于MVC（模型- 视图- 控制器）设计模式。从视图中的Ajax应用，到控制器中的访问请求和反馈，到封装数据库的模型，Rails
        为你提供一个纯Ruby的开发环境,它基于一种计算机软件语言Ruby,给程序开发人员提供了强大的框架支持。Rails结合了PHP体系的优点（快速开发）和Java体系的优点（程序规整）</p>
      <a class="btn btn-info" href="http://guides.ruby-china.org/">More Info</a>
    </div>
  </div>
</div>
